<template>
    <div>
        <table>
            <tr>
                <td>姓名</td>
                <td><input type="text" v-model="data.name"></td>
            </tr>
            <tr>
                <td>密码</td>
                <td><input type="password" v-model="data.pwd"></td>
            </tr>
            <tr>
                <td>手机号</td>
                <td><input type="text" v-model="data.phone"></td>
            </tr>
            <tr>
                <td>房型</td>
                <td>
                    <select v-model="data.fent">
                        <option value="0">请选择</option>
                        <option value="单人间">单人间</option>
                        <option value="双人间">双人间</option>
                        <option value="大床房">大床房</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>数量</td>
                <td><input type="text" v-model="data.num"></td>
            </tr>
            <tr>
                <td>价钱</td>
                <td><input type="text" v-model="data.price"></td>
            </tr>
            <tr>
                <td>图片</td>
                <td>
                    <input type="file" @change="Tent">
                    <img :src="'https://localhost:7087'+data.img" alt="" style="width: 80px;height: 80px;">
                </td>
            </tr>
            <tr>
                <td>上下架</td>
                <td>
                    <input checked type="radio" v-model="data.shen"  :value="true">上架
                    <input type="radio" v-model="data.shen"  :value="false">下架
                </td>
            </tr>
            <tr>
                <td><input type="button" value="添加" @click="Add"></td>
            </tr>
        </table>
    </div>
</template>

<script setup lang="ts">
import {ref} from 'vue';
import axios from 'axios';
import { useRouter } from 'vue-router';

const rount=useRouter()

const Tent=(e:any)=>{
    var f=e.target.files[0];
    if(f.size>1024*1024*2){
        alert('上传文件小于2M')
        return;
    }
    if(f.type!="image/png"&&f.type!="image/jpeg"){
        alert('文件只能是png或jpg类型')
        return;
    }

    var fd=new FormData();
    fd.append("file",f);
    axios.post("https://localhost:7087/api/UpLog",fd).then(res=>{
        data.value.img=res.data;
    })
}


const data=ref({
  "id": 0,
  "name": "",
  "pwd": "",
  "phone": "",
  "fent": "0",
  "num": 0,
  "price": 0,
  "img": "",
  "shen": true
})

const Add=()=>{
    if(data.value.name==""){
        alert('姓名不能为空')
        return;
    }
    if(data.value.phone==""){
        alert('手机号不能为空')
        return;
    }


    axios.post("https://localhost:7087/api/User/Add",data.value).then(res=>{
        if(res.data>0){
            alert('成功')
            rount.push({path:'/ShowView'})
        }
        else{
            alert('失败')
        }
    })
}
 

</script>

<style scoped>

</style>